﻿<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>web前端工程师个人简历</title>
    <meta name="keywords" content="个人简历,web前端工程师,个人主页,web技术交流">
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="css/index.min.css">
    <link rel="icon" href="/favicon.ico" type="image/x-icon"/>
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon"/>
    <link rel="Bookmark" href="/favicon.ico"/>
    <!--[if lt IE 9]>
    <script src="js/html5shiv.js"></script>
    <script src="js/respond.js"></script>
    <![endif]-->
</head>
<body>
<div id="bg-image">
    <img src="images/4.jpg" alt="">
</div>
<div id="main-page">
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <div class="row">
                    <div class="col-md-3  left-bg">
                        <div class="row">
                            <div class="col-md-12 col-sm-3 col-xs-12">
                                <div id="profile-img">
                                    <img src="images/p.jpg" alt="">
                                </div>
                            </div>
                            <div class="col-md-12 col-sm-9 col-xs-12">
                                <div id="profile-top">
                                    <h2>张成广</h2>
                                    <h4>web前端工程师 &1.5年</h4>
                                    <p>中国 · 北京 · 昌平</p>
                                </div>
                                <div id="profile-mid">
                                    <p>对互联网强烈的好奇心和浓厚的兴趣，有良好进取心，学习能力强，可快速融入团队。</p>
                                    <p style="margin-top:-10px;">
                                        熟悉W3C标准，对表现与数据分离、Web语义化等有深刻理解。 深入理解JavaScript面向对象原理。 理解AJAX运作机制，熟练掌握JQuery等主流JS框架。 能够熟练应用HTML/CSS/JavaScript技术，开发符合W3C标准的网站前端页面。 
                                </div>
                                <div id="profile-bot"></div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-9">
                        <div id="content">
                            <div id="content-resume">
                                <div class="content-container">
                                    <h3>个人简介</h3>
                                    <div class="content-item-01">
                                        <div class="resume">
                                            <span>基 本 信 息</span>
                                            <ul>
                                                <li>
                                                    <i class="glyphicon glyphicon-user"></i>
                                                    <label>姓名</label>
                                                    <s>张成广</s>
                                                </li>
                                                <li>
                                                    <i class="glyphicon glyphicon-calendar"></i>
                                                    <label>出生日期</label>
                                                    <s>1993年10月</s>
                                                </li>
                                                <li>
                                                    <i class="glyphicon glyphicon-education"></i>
                                                    <label>学历</label>
                                                    <s>专科</s>
                                                </li>
                                                <li>
                                                    <i class="glyphicon glyphicon-phone"></i>
                                                    <label>电话</label>
                                                    <s>18519198293</s>
                                                </li>
                                                <li>
                                                    <i class="glyphicon glyphicon-envelope"></i>
                                                    <label>邮箱</label>
                                                    <s>m18519198293@163.com</s>
                                                </li>

                                                <li>
                                                    <i class="glyphicon glyphicon-modal-window"></i>
                                                    <label>目前状态</label>
                                                    <s>离职</s>
                                                </li>
                                                <li>
                                                    <i class="glyphicon glyphicon-flag"></i>
                                                    <label>期望工作</label>
                                                    <s>web前端工程师</s>
                                                </li>
                                                <li>
                                                    <i class="glyphicon glyphicon-plane"></i>
                                                    <label>期望行业</label>
                                                    <s>互联网、电子商务、生活服务</s>
                                                </li>
                                            </ul>
                                        </div>
                                        <div class="crl">
                                            <div class="carousel slide" data-ride="carousel" data-interval="3000">
                                                <div class="carousel-inner">
                                                    <div class="item">
                                                        <img src="images/1.jpeg">
                                                    </div>
                                                    <div class="item active">
                                                        <img src="images/2.jpeg">
                                                    </div>
                                                    <div class="item">
                                                        <img src="images/3.jpg">
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                    </div>

                                </div>
                            </div>
                            <div id="content-skill">
                                <div class="skill-container">
                                    <h3>个人履历</h3>
                                    <div class="skill">
                                        <span style="margin-top:0;">前端语言</span>
                                        <div class="html">
                                            <s>Html/HTML5</s>
                                            <i>90%</i>
                                        </div>
                                        <div class="css">
                                            <s>CSS/CSS3</s>
                                            <i>95%</i>
                                        </div>
                                        <div class="js">
                                            <s>JavaScript</s>
                                            <i>90%</i>
                                        </div>
                                        <span>前端框架</span>
                                        <div class="jq">
                                            <s>jQuery</s>
                                            <i>80%</i>
                                        </div>
                                        <div class="bs">
                                            <s>bootStrap</s>
                                            <i>65%</i>
                                        </div>
                                        <div class="agl">
                                            <s>angularJS</s>
                                            <i>50%</i>
                                        </div>
                                        <div class="swipe">
                                            <s>swipe.js</s>
                                            <i>50%</i>
                                        </div>
                                        <span>工具软件</span>
                                        <div class="storm">
                                            <s>webStorm</s>
                                            <i>90%</i>
                                        </div>
                                        <div class="Sublime ">
                                            <s>Sublime </s>
                                            <i>70%</i>
                                        </div>
                                        <div class="Dw">
                                            <s>AdobeDreameaverCs6</s>
                                            <i>60%</i>
                                        </div>
                                        <div class="Ps ">
                                            <s>PhotoShop </s>
                                            <i>60%</i>
                                        </div>
                                        <div class="space"></div>
                                    </div>
                                    <div class="exp">
                                        <span style="margin-top:0;">工作经验</span>
                                        <div class="exp-content">
                                            <div class="exp-top">
                                                <s>产品规划工程师</s>
                                                <i class="glyphicon glyphicon-calendar"></i>
                                                <label>2015.7-2016.6</label>
                                            </div>
                                            <div class="exp-mid">
                                                <b class="glyphicon glyphicon-map-marker"></b>
                                                <span>北京小区时代网络科技有限公司</span>
                                                <p>工作地点：北京</p>
                                                <p style="margin-top:-13px">工作职责：</p>
                                                <ul>
                                                    <li> 1.根据公司项目UI设计师设计和项目需求，迅速将内容构成div+css或者table等等html代码</li>
                                                    <li> 2.与产品经理、设计师、后端工程师紧密工作在一起，沟通并确定产品开发需求</li>
                                                    <li> 3.解决不同的浏览器及不同版本的浏览器兼容性问题，网页产品页面交互效果的实现</li>
                                                    <li> 4.使用JavaScript和JQuery实现页面上的动态效果以及交互效果，列如：选项卡、图片轮播图等</li>
                                                    <li> 5. 与后端开发人员配合完成接口定义和数据交互绑定，以及项目功能的调试</li>

                                                </ul>
                                            </div>
                                        </div>
                                        <div class="exp-content">
                                            <div class="exp-top">
                                                <s>前端页面设计师</s>
                                                <i class="glyphicon glyphicon-calendar"></i>
                                                <label>2014.11-2015.4</label>
                                            </div>
                                            <div class="exp-mid">
                                                <b class="glyphicon glyphicon-map-marker"></b>
                                                <span>北京中科软股份有限公司</span>
                                                <p>工作地点：北京</p>
                                                <p style="margin-top:-13px">工作职责：</p>
                                                <ul>
                                                    <li>（1）从事的工作是根据公司需求设计出设计图纸</li>
                                                    <li>（2）并用代码敲写编辑出静态页面和功能模块</li>
                                                </ul>
                                            </div>
                                        </div>

                                        <div class="exp-content">
                                            <div class="exp-top">
                                                <s>专科</s>
                                                <i class="glyphicon glyphicon-calendar" style="right:-190px;"></i>
                                                <label>2013.9-2016.7</label>
                                            </div>
                                            <div class="exp-mid">
                                                <b class="glyphicon glyphicon-map-marker"></b>
                                                <span>滨州职业学院</span>
                                                <p>地点：滨州</p>
                                                <p>专业：设计</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div id="content-works">
                                <div class="works-container">
                                    <h3>我的作品</h3>
                                    <div class="work-img">
                                        <ul>
                                            <li id="jd">
                                                <a href="#">
                                                    <img src="images/jd.jpg" alt="">
                                                </a>
                                                <div class="jd-mark">
                                                    <h4></h4>
                                                    <p></p>
                                                </div>
                                            </li>
                                            <li id="intel" style="margin-left:10px;">
                                                <a href="#">
                                                    <img src="images/intel.jpg">
                                                </a>
                                                <div class="intel-mark">
                                                    <h4></h4>
                                                    <p></p>
                                                </div>
                                            </li>
                                            <li id="game">
                                                <a href="#">
                                                    <img src="images/game2048.jpg" alt="">
                                                </a>
                                                <div class="game-mark">
                                                    <h4></h4>
                                                    <p></p>
                                                </div>
                                            </li>
                                            <li id="p360" style="margin-left:10px;">
                                                <a href="#">
                                                    <img src="images/p360.jpg" alt="">
                                                </a>
                                                <div class="p360-mark">
                                                    <h4></h4>
                                                    <p></p>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <s></s>
                                </div>
                            </div>
                            <div id="content-side">
                                <ul>
                                    <li id="icon-resume">
                                        <div>
                                            <i class="glyphicon glyphicon-user"></i>
                                        </div>
                                    </li>
                                    <li id="icon-skill">
                                        <div>
                                            <i class="glyphicon glyphicon-book"></i>
                                        </div>
                                    </li>
                                    <li id="icon-works">
                                        <div>
                                            <i class="glyphicon glyphicon-hdd"></i>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="js/jquery_1.11.3.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/main.min.js"></script>
</body>
</html>